<script setup lang="ts">
import { useImageStore } from '@/stores/Image.ts';

const imageStore = useImageStore();
imageStore.getIcon();

const copyright = import.meta.env.VITE_COPYRIGHT;
</script>

<template>
  <div
    class="flex h-[240px] flex-col items-center justify-center bg-[rgb(41,156,12)] text-center text-sm font-[500] text-[#64748B]"
  >
    <!-- 版权信息 -->
    <div class="mb-4">
      <span class="text-xl font-normal text-white">{{ copyright }}</span>
    </div>
    <!-- 将 logo 图片包裹在一个 flex 容器中 -->
    <div class="flex flex-row gap-12">
      <img
        v-for="(img, index) in imageStore.image"
        :key="index"
        :src="img.src"
        alt="Header Image"
        class="logo-image"
      />
    </div>
  </div>
</template>

<style scoped>
.logo-image {
  max-height: 120px;
  width: auto;
}
</style>
